<template>
	<view :class="[BackGround]" :style="[{'font-weight':Style,'font-family':Font,height:100 + '%',minHeight:screenHeight + 'px'}]">
		<cu-custom isBack="true" bgColor="bg-gradual-blue">
			<block slot="backText">返回</block>
			<block slot="content">梳棉实时数据详情</block>
		</cu-custom>
		<view class="fixedtwo" :style="{top:CustomBar + 'rpx'}">
			<text class="texttwo">{{name}}</text>
			<image style="width: 50%;height: 400rpx;" mode="scaleToFill" src="/static/images/timedataCardingdetail.jpg"></image>
			<view class="" style="background-color: whitesmoke;width: 54%;">
				<view style="padding: 10rpx;">基础信息</view>
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 机器型号:{{LPRCTYPE}} {{LMACHINETYPE}}
				</view>
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 运行状态:
				</view>
				<!-- <view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 当前班生产米数:{{tableList['当前班生产米数']}}
				</view>
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 当前班落纱次数:{{tableList['当前班落纱次数']}}
				</view>
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 当前班工作效率:{{tableList['当前班工作效率']}}
				</view>
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 当前班工作时间:{{tableList['当前班工作时']}} 时 {{tableList['当前班工作分']}} 分
				</view> -->
				<view class="" style="height: 50rpx;line-height: 50rpx;">
					<text class="cuIcon-title text-orange "></text> 总产量:
				</view>
			</view>
		</view>
		<!-- <scroll-dome :list="list" :isShow="false" @jumpArchives="jumpArchives"></scroll-dome> -->
		<navTab ref="navTab" :number="5" :tabTitle="tabTitle" @changeTab='changeTab'></navTab>
		<swiper :current="currentTab" @change="swiperTab" class="swiper" :style="{top:CustomBar + 500 + 'rpx',height:height + 'px'}">
			<swiper-item v-for="(listItem,index) in deliverplan" :key="listItem.id">
				<scroll-view style="height: 100%;" scroll-y scroll-with-animation>
					<!-- 数据列表组件 -->
					<scroll-view style="height: 100%;" scroll-y scroll-with-animation>
						<view v-if="index == 0">
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>锡林设置速度(r/min)</view>
									<view style="text-align:center">360</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>盖板设置速度(mm/min)</view>
									<view style="text-align:center">300</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>打手保护速度(r/min)</view>
									<view style="text-align:center">500</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>清洁辊保护(r/min)</view>
									<view style="text-align:center">500</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>刺辊保护速度(r/min)</view>
									<view style="text-align:center">500</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>断条时间1(S)</view>
									<view style="text-align:center">3.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>断条时间2(S)</view>
									<view style="text-align:center">0.2</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>锡林带轮(mm)</view>
									<view style="text-align:center">190</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>生头延时(S)</view>
									<view style="text-align:center">0.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>CV超限值(%)</view>
									<view style="text-align:center">0.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>CV时间1(S)</view>
									<view style="text-align:center">00</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>CV时间2(min)</view>
									<view style="text-align:center">0</view>
								</view>
							</view>
						</view>
						<view v-if="index == 1">
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>出条速度(m/min)</view>
									<view style="text-align:center">210</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>满桶长度(m)</view>
									<view style="text-align:center">6000</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>矛满桶长度(m)</view>
									<view style="text-align:center">5900</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>棉条定量</view>
									<view style="text-align:center">1500</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>棉箱压力(Pa)</view>
									<view style="text-align:center">350</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>牵伸比</view>
									<view style="text-align:center">90</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>长短比例2</view>
									<view style="text-align:center">70</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>棉层保护</view>
									<view style="text-align:center">0.8</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>牵伸系数(%)</view>
									<view style="text-align:center">90</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>生头速度(m/min)</view>
									<view style="text-align:center">0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>中速速度(m/min)</view>
									<view style="text-align:center">50</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>升速时间(S)</view>
									<view style="text-align:center">20</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>吹气间隔(S)</view>
									<view style="text-align:center">120.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>吹气时间</view>
									<view style="text-align:center">0.0</view>
								</view>
							</view>
						</view>
						<view v-if="index == 2">
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节长度1(cm)</view>
									<view style="text-align:center">10</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节长度2(cm)</view>
									<view style="text-align:center">15</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节长度3(cm)</view>
									<view style="text-align:center">20</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节长度4(cm)</view>
									<view style="text-align:center">25</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节长度5(cm)</view>
									<view style="text-align:center">30</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节1(%)</view>
									<view style="text-align:center">5</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节2(%)</view>
									<view style="text-align:center">15</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节3(%)</view>
									<view style="text-align:center">20</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节4(%)</view>
									<view style="text-align:center">25</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>生条定量(g/m)</view>
									<view style="text-align:center">6.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>重量偏差</view>
									<view style="text-align:center">0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>超差延时(S)</view>
									<view style="text-align:center">3.0</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>压辊反馈</view>
									<view style="text-align:center">600</view>
								</view>
							</view>
						</view>
						<view v-if="index == 3">
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>总产量(km)</view>
									<view style="text-align:center">5875.1</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>夜班产量(km)</view>
									<view style="text-align:center">10.1</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>早班产量(km)</view>
									<view style="text-align:center">86.7</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>中班产量(km)</view>
									<view style="text-align:center">100.9</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>当前产量(km)</view>
									<view style="text-align:center">7.8</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>总时间(d)</view>
									<view style="text-align:center">5</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>粗细节2(%)</view>
									<view style="text-align:center">22.8</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>夜班计时(h)</view>
									<view style="text-align:center">0.7</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>早班计时(h)</view>
									<view style="text-align:center">7.1</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>中班计时(h)</view>
									<view style="text-align:center">7.8</view>
								</view>
							</view>
							<view class="cu-form-group">
								<view class="grid col-2" style="width: 100%;color:rgb(127, 184, 178);">
									<view>当前计时(h)</view>
									<view style="text-align:center">0.7</view>
								</view>
							</view>
						</view>
						<view v-if="index == 4">
							<view class="flex padding-sm justify-around" style="color: rgb(127, 184, 178);">
								<view>报警历史</view>
								<view>共10个报警</view>
							</view>
							<view class="flex p-xs margin-bottom-sm mb-sm" style="color: rgb(127, 184, 178);">
								<view class="flex-treble padding-sm text-center radius">登录号</view>
								<view class="flex-Nine padding-sm radius text-center">消息</view>
							</view>
							<view style="color: rgb(127, 184, 178);" class="flex  p-xs margin-bottom-sm mb-sm" v-for="(item,index5) in 10" :key="index5">
								<view class="flex-treble padding-sm text-center radius">1</view>
								<view class="flex-Nine text-center radius">断条断头停车</view>
							</view>
						</view>
					</scroll-view>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	import navTab from '@/colorui/components/navTab.vue'
	import ScrollDome from '@/colorui/components/ScrollDome'
	import {
		mapGetters
	} from 'vuex'
	import {
		getMinuteInfo
	} from '@/service/selectList'
	export default {
		data() {
			return {
				name:'',
				CustomBar: this.CustomBar,
				screenHeight: this.screenHeight,
				tabTitle: ['工作参数1', '工艺参数1', '工艺参数2', '产量统计', '报警信息'], //导航栏格式
				currentTab: 0, //sweiper所在页
				deliverplan: [{
						newsList: [],
						isShow: true,
						id: '1'
					},
					{
						newsList: [],
						isShow: true,
						id: '2'
					},
					{
						newsList: [],
						isShow: true,
						id: '3'
					},
					{
						newsList: [],
						isShow: true,
						id: '4'
					},
					{
						newsList: [],
						isShow: true,
						id: '5'
					},
				]
			}
		},
		components: {
			ScrollDome,
			navTab,
		},
		computed: {
			...mapGetters(['Style', 'Font','BackGround','BackGroundBox']),
			height() {
				return this.screenHeight - uni.upx2px(this.CustomBar) - uni.upx2px(490)
			}
		},
		onLoad(option) {
			this.LPRCTYPE = option.LPRCTYPE
			this.LMACHINETYPE = option.LMACHINETYPE
			
		},
		methods: {
			changeTab(index) {
				this.currentTab = index
			},
			// swiper 滑动
			swiperTab(e) {
				var index = e.detail.current //获取索引
				console.log(index);
				if (this.tabTitle.length <= 5) {
					this.$refs.navTab.navClick(index)
				} else {
					this.$refs.navTab.longClick(index)
				}
			},
			//监听用户下拉事件
			onPullDownRefresh() {
				setTimeout(function() {
					uni.stopPullDownRefresh();
				}, 1000);
			},
		}
	}
</script>

<style lang="scss">
	.fixedtwo {
		position: fixed;
		display: flex;
		left: 0px;
		width: 100%;
	
		.texttwo {
			position: absolute;
			z-index: 1;
			font-size: 40rpx;
			color: #007AFF;
			left: 30rpx;
			bottom: 30rpx;
		}
	}
	.swiper {
		position: fixed;
		width: 100%;
		left: 0px;
	}
</style>
